<template>
  <Form
    ref="formValidate"
    :model="formValidate"
    :rules="ruleValidate"
    :label-width="80"
  >
    <FormItem
      label="用户名"
      prop="name"
    >
      <Input
        v-model="formValidate.name"
        placeholder="用户名"
      />
    </FormItem>
    <FormItem
      label="密码"
      prop="pwd"
    >
      <Input
        type="password"
        v-model="formValidate.pwd"
        placeholder="密码"
      />
    </FormItem>
      <FormItem
      label="头像"
      prop="photo"
    >
      <Input
        type="url"
        v-model="formValidate.photo"
        placeholder="头像"
      />
    </FormItem>
    <FormItem
      label="昵称"
      prop="nick"
    >
      <Input
        v-model="formValidate.nick"
        placeholder="昵称"
      />
    </FormItem>

    <FormItem
      label="电话"
      prop="phone"
    >
      <Input
        type="tel"
        v-model="formValidate.phone"
        placeholder="电话"
      />
    </FormItem>


    <FormItem
      label="邮箱"
      prop="email"
    >
      <Input
        type="email"
        v-model="formValidate.email"
        placeholder="邮箱"
      />
    </FormItem>

    <FormItem
      label="性别"
      prop="sex"
    >
      <RadioGroup v-model="formValidate.sex">
        <Radio label="男">男</Radio>
        <Radio label="女">女</Radio>
      </RadioGroup>
    </FormItem>
  </Form>
</template>

<script>
export default {
  data() {
    return {
      formValidate: {
        name: '',
        pwd: '',
        photo:'',
        nick: '',
        phone: '',
        email: '',
        sex: '',
      },
      ruleValidate: {
        name: [{
          required: true,
          message: '名称不能为空',
          trigger: 'blur'
        }],
         pwd: [{
          required: true,
          message: '请输入密码',
          trigger: 'blur'
        }],
         photo: [{
          required: true,
          message: '请输入头像连接',
          trigger: 'blur'
        }],
        nick: [{
          required: true,
          message: '昵称不能为空',
          trigger: 'blur'
        }],
        phone: [{
          required: true,
          message: '电话不能为空',
          trigger: 'blur'
        }],
        email: [{
          required: true,
          message: '邮箱不能为空',
          trigger: 'blur'
        },
        {
          type: 'email',
          message: '电子邮件格式不正确',
          trigger: 'blur'
        },
        ],

        sex: [{
          required: true,
          message: '请选择性别',
          trigger: 'change'
        }],
       
      },
    }
  },
  methods: {
  },
}
</script>
